<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>

<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
<meta name="description" content="">
<meta name="author" content="">

<title>客户商品</title>

<!-- Bootstrap core CSS -->
<link href="<%=basePath%>css/bootstrap.min.css" rel="stylesheet">

<!-- Custom styles for this template -->
<link href="<%=basePath%>css/designer.css" rel="stylesheet">

<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
      <script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
<script type="text/javascript" src="<%=basePath%>js/jquery-1.10.2.min.js"></script>
</head>

<body>
  <script type="text/javascript" src="<%=basePath%>js/wz_tooltip.js"></script>
  <jsp:useBean id="Tel" class="com.xlf.cache.Tel"/>
  <form id="orderForm" action="/designer/saveOrder" method="post" enctype="multipart/form-data">
    <input type="hidden" name="order.u_id" value="${designer.u_id }">
    <input type="hidden" name="order.planType" value="${planType }">
    <input type="hidden" id="orderDiscount" name="order.discount" value="0">
    <input type="hidden" id="orderPrice" name="order.price" value="${price }">
    <div class="container">
      <div class="form-horizontal">
        <div class="row">

          <div class="col-md-6">

            <fieldset>
              <div id="legend">
                <legend>客户信息</legend>
              </div>
              <div class="form-group">
                <label class="col-sm-3 control-label">订单编号</label>
                <div class="col-sm-8">
                  <input type="text" class="form-control" name="order.o_id" value="${orderId }" readonly="readonly">
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-3 control-label">创建日期</label>
                <div class="col-sm-8">
                  <input type="text" class="form-control" value="${createTime }" readonly="readonly">
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-3 control-label">客户姓名</label>
                <div class="col-sm-8">
                  <input type="text" class="form-control" name="order.custerName">
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-3 control-label">客户电话</label>
                <div class="col-sm-8">
                  <input type="text" class="form-control" name="order.custerTel">
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-3 control-label">客户地址</label>
                <div class="col-sm-8">
                  <input type="text" class="form-control" name="order.custerAddress">
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-3 control-label">房屋面积</label>
                <div class="col-sm-8">
                  <input type="text" class="form-control" name="order.roomSize">
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-3 control-label">购房合同照片</label>
                <div class="col-sm-8">
                  <input type="file" class="form-control" name="contractImg">
                </div>
              </div>
            </fieldset>
          </div>
          <div class="col-md-6">
            <fieldset>
              <div id="legend">
                <legend>公司信息</legend>
              </div>
              <div class="form-group">
                <label class="col-sm-3 control-label">设计师姓名</label>
                <div class="col-sm-8">
                  <input type="text" class="form-control" name="order.designerName" value="${designer.name }" readonly="readonly">
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-3 control-label">设计师电话</label>
                <div class="col-sm-8">
                  <input type="text" class="form-control" name="order.designerTel" value="${designer.tel }" readonly="readonly">
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-3 control-label">主材部电话</label>
                <div class="col-sm-8">
                  <input type="text" class="form-control" value="${Tel.getMaterialTel() }" readonly="readonly">
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-3 control-label">工程部电话</label>
                <div class="col-sm-8">
                  <input type="text" class="form-control" value="${Tel.getEngineTel() }" readonly="readonly">
                </div>
              </div>
            </fieldset>
          </div>
        </div>
      </div>
      <div class="row">
        <fieldset>
          <div id="legend">
            <legend>主材明细</legend>
          </div>
        </fieldset>
      </div>
      <c:forEach items="${sessionCar.getSessionCatalogs() }" var="catalog" varStatus="s">
        <c:if test="${catalog.sessionItems.size() > 0 }">
          <div class="row">
            <div class="panel panel-default">
              <div class="panel-heading"><strong>${catalog.name }</strong></div>
              <div class="panel-body">
                <table class="table table-bordered table-striped">
                  <thead>
                    <tr>
                      <c:if test="${catalog.c_id == 9 }">
                        <th>名称</th>
                      </c:if>
                      <c:if test="${catalog.c_id != 9 }">
                        <th>图片</th>
                        <th>品牌</th>
                        <th>型号</th>
                        <th>规格</th>
                        <th>材质</th>
                      </c:if>
                      <th>单位</th>
                      <c:if test="${sessionScope.xlf_planType == '4' }">
                        <th>价格</th>
                      </c:if>
                      <th>数量</th>
                      <th>使用位置</th>
                      <th>备注</th>
                    </tr>
                  </thead>
                  <tbody>
                    <c:forEach items="${catalog.sessionItems }" var="itemMap" varStatus="s">
                      <tr>
                        <c:if test="${catalog.c_id == 9 }">
                          <td>${itemMap.value.brand }</td>
                        </c:if>
                        <c:if test="${catalog.c_id != 9 }">
                          <td>
                          <a href="#" onmouseover="TagToTip('span${itemMap.value.p_id }');" onmouseout="UnTip();"><img src="<%=basePath %>upload/${itemMap.value.pic }" border="0" class="product_img"/></a>
                          <span id="span${itemMap.value.p_id }">
                            <img src="<%=basePath %>upload/${itemMap.value.pic }" width="196px" height="196px">
                          </span>
                          </td>
                          <td>${itemMap.value.brand }</td>
                          <td>${itemMap.value.type }</td>
                          <td>${itemMap.value.spec }</td>
                          <td>${itemMap.value.material }</td>
                        </c:if>
                        <td>${itemMap.value.unit }</td>
                        <c:if test="${sessionScope.xlf_planType == '4' }">
                          <td>${itemMap.value.price }</td>
                        </c:if>
                        <td>${itemMap.value.count }</td>
                        <td>${itemMap.value.location }</td>
                        <td>${itemMap.value.itemRemark }</td>
                      </tr>
                    </c:forEach>
                  </tbody>
                </table>
              </div>
              <div style="padding-left: 15px; padding-right: 15px;">
                <label>补充说明(特殊工艺或造型)</label>
              </div>
              <div style="padding-left: 15px; padding-right: 15px;">
                <textarea class="form-control" name="catalogRemark${catalog.c_id }"></textarea>
              </div>
              <div>
                <label></label>
              </div>
              <div class="row" style="padding-left: 15px; padding-top: 10px; padding-bottom: 10px;">
                <div class="col-sm-4">客户确认签字:</div>
                <div class="col-sm-4">主材经理签字:</div>
                <div class="col-sm-4">主材专员签字:</div>
              </div>
            </div>
          </div>
        </c:if>
      </c:forEach>

      <div class="row">
        <fieldset>
          <div id="legend">
            <legend>订单总览</legend>
          </div>
        </fieldset>
      </div>
      <div class="row">
        <div class="panel panel-default">
          <div class="panel-heading">总览</div>
          <div class="panel-body">
            <div>
              <label>备注（增减项说明）</label>
            </div>
            <div>
              <textarea class="form-control" rows="4" name="order.orderRemark"></textarea>
            </div>
            <div class="row">
              <c:if test="${sessionScope.xlf_planType == '4' }">
                <!-- 自选套餐带有折扣信息 -->
                <div class="col-md-4" style="margin-top:15px;">
                  <span>
                    <input type="checkbox" id="setDiscount" onclick="setdiscount();">折扣
                  </span>&nbsp;
                  <span id="discountArea" style="display:none;">
                    <input style="height: 30px;" type="text" size="3" id="discount">&nbsp;折&nbsp;<input type="button" value="计算折扣价格" class="btn btn-info" onclick="totalPrice();">
                  </span>
                </div>
                <div class="col-md-4 col-md-offset-4">
                  <h4>订单总价：￥<span id="showPrice">${price }</span></h4>
                </div>
              </c:if>
              <c:if test="${sessionScope.xlf_planType != '4' }">
                <!-- 标准套餐 -->
                <div class="col-md-4 col-md-offset-8">
                  <h4>订单总价：￥${price }</h4>
                </div>
              </c:if>
            </div>
            <div class="row" style="padding-top:15px;">
              <div class="col-sm-4">客户确认签字:</div>
              <div class="col-sm-4">主材经理签字:</div>
              <div class="col-sm-4">主材专员签字:</div>
            </div>
          </div>
        </div>
      </div>

      <div class="row">
        <div class="col-md-4 col-md-offset-4">
          <input type="submit" class="btn btn-lg btn-block btn-success" value="订单确认" />
        </div>
        <div class="col-md-2">
          <a href="/designer/plan" class="btn btn-lg btn-block btn-default" onclick="return confirm('确认放弃此订单?')">放弃订单</a>
        </div>
      </div>
    </div>
  </form>
  <!-- /container -->
  <script type="text/javascript">
  function totalPrice() {
  	var discount = $("#discount").val();
  	if(discount > 10) {
  		alert("折扣值需控制在[0-10]范围内");
  		return;
  	}
  	var price = ${price };
  	var res = price * discount * 0.1;
  	//alert(discount);
  	//alert(price);
  	//alert(res);
  	var totalPrice = res.toFixed(2);
  	
  	$("#orderPrice").val(totalPrice);
  	$("#orderDiscount").val(discount);
  	$("#showPrice").html(totalPrice);
  }
  
  function setdiscount() {	 
	  if($("#setDiscount").is(":checked")) {
		  $("#discountArea").show();
	  } else {
		  $("#discountArea").hide();
		  $("#showPrice").html("${price }");
		  $("#orderPrice").val(${price });
		  $("#discount").val("");
		  $("#orderDiscount").val(0);
	  }
	  
  }
  </script>
</body>

</html>